<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<!DOCTYPE html>
<html lang="zxx">
<head>
    <jsp:include page="/static/common/easyui_header.jsp"></jsp:include>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>德客系统</title>
    <!-- Meta tag Keywords -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://cdn.dingxiang-inc.com/ctu-group/captcha-ui/index.js"></script>

    <%--引入插件--%>
    <!-- //Jquery -->
    <!--css文件-->
    <link rel="stylesheet" href="./style.css" type="text/css" media="all">
    <!-- Style-CSS -->
    <link rel="stylesheet" href="./fontawesome-all.css">

    <link href="./css" rel="stylesheet">
    <link href="./css(1)" rel="stylesheet">

    <style type="text/css">
        body {
            /*背景图片的地址*/
            background-image: url(/static/mainMenuImage/bgImage.jpg);
            /*图片不重复*/
            background-repeat: no-repeat;
            /*背景颜色的尺寸*/
            background-size: 100% 100%;
            /*固定*/
            background-attachment: fixed;
        }

        #loginButton {
            color: #fff;
            background: #f7296f;
            border: none;
            padding: 13px 0;
            margin-top: 30px;
            outline: none;
            width: 36%;
            font-size: 16px;
            cursor: pointer;
            letter-spacing: 2px;
            -webkit-transition: 0.5s all;
            -o-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -ms-transition: 0.5s all;
            transition: 0.5s all;
            box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.49);
        }


    </style>

    <%--登录的js--%>
    <script type="text/javascript">

        addEventListener("load", function () {
            setTimeout(hideURLbar, 0);
        }, false);

        function hideURLbar() {
            window.scrollTo(0, 1);
        }

        //配置点击事件,然后执行js代码,,提交到controller
        $(function () {

            /*//点击事件,发送到login的controller

             $("#loginForm").form("submit", {
             url: "/login",
             success: function (data) {
             console.log(data);
             data = $.parseJSON(data);//转换data的数据类型
             if (data.success) {
             window.location.href = "/main";
             } else {
             $.messager.alert("提示", data.msg, "error");//账号或密码错误
             }
             }
             })*/
            $("#loginButton").click(function () {
                var xxx = $("#temp_for_url").prop("xxx");
                if (xxx == null) {
                    $.messager.alert("提示", "请滑动验证码验证", "error");//账号或密码错误
                } else {
                    $("#loginForm").form("submit", {
                        url: "/login",
                        success: function (data) {
                            data = $.parseJSON(data);//转换data的数据类型
                            if (data.success) {
                                window.location.href = "/main";
                            } else {
                                $.messager.alert("提示", data.msg, "error");//账号或密码错误
                            }
                        }
                    })
                }
            });
        });
    </script>


</head>

<body>


<div id="bg">
    <canvas width="1502" height="670"></canvas>
    <canvas width="1502" height="670"></canvas>
    <canvas width="1502" height="670"></canvas>
</div>
<!-- //bg effect -->
<!-- title -->
<h2 style="text-align: center">德客系统,做高端的软件</h2>
<!-- //title -->
<!-- content -->
<div class="sub-main-w3" style="padding-top: 100px">
    <form id="loginForm" method="post">
        <h2>朕要登录
        </h2>
        <div class="form-style-agile">
            <label>
                用户名
            </label>
            <input placeholder="用户名" name="username" type="text" required="">
        </div>
        <div class="form-style-agile">
            <label>
                密码
            </label>
            <input placeholder="密码" name="password" type="password" required="">
        </div>

        <div id="temp_for_url" xxx=""></div>
        <div class="ln">
            <div class="block">
                <div class="eg">
                    <div style="width:1502px" id="demo-inline-up"></div>
                </div>
                <div class="code">
                    <br>
                    <pre></pre>
                    <script>
                        _dx.Captcha(document.getElementById('demo-inline-up'), {
                            appId: '19be17f19909b38fda912c7863e249a1',
                            style: 'inline',
                            language: 'cn', // 语言为中文
                            width: 400,     // 滑动条长度
                            success: function (token) {  // 验证成功回调
                                $("#temp_for_url").prop("xxx", "x");
                            }
                        });
                    </script>
                </div>
            </div>
        </div>

        <!-- checkbox -->
        <div class="wthree-text">
            <ul>
                <li>
                    <label class="anim">
                        <input type="checkbox" class="checkbox">
                        <span>记住我</span>
                    </label>
                </li>
                <li>
                    <a href="?">忘记 密码?</a>
                </li>
            </ul>
        </div>
        <!-- //checkbox -->
        <input type="button" id="loginButton" value="登录">
    </form>
</div>
<!-- //content -->

<!-- copyright -->
<div class="footer">
    <p>Copyright © 2018.叩丁狼出品</p>
</div>


<script src="canva_moving_effect.js"></script>

</body>
</html>